<html>
<head>
	<link rel="stylesheet" type="text/css" href="../yui/build/reset/reset.css">
	<link rel="stylesheet" type="text/css" href="../yui/build/fonts/fonts.css">
	<link rel="stylesheet" type="text/css" href="../yui/build/menu/assets/skins/sam/menu.css">
	
	<script type="text/javascript" src="../yui/build/yahoo/yahoo.js"></script>
	<script type="text/javascript" src="../yui/build/event/event.js"></script>
	<script type="text/javascript" src="../yui/build/dom/dom.js"></script>
	<script type="text/javascript" src="../yui/build/animation/animation.js"></script>
	<script type="text/javascript" src="../yui/build/container/container_core.js"></script>
	<script type="text/javascript" src="../yui/build/menu/menu.js"></script>

	<script language="JavaScript">
		var count = 0;
		var arrMenu = new Array();
		var arrOMenu = new Array();
	
		function initMenuItem() {
			for(var i = 0 ; i < 100; i++) {
				var myContextMenu = [ {
					text :"menuitem11",
					onclick : {
						fn :onMenuItemClick,
						obj :"menuitem11"
					}
				}, {
					text :"menuitem12",
					onclick : {
						fn :onMenuItemClick,
						obj :"menuitem12"
					}
				}, {
					text :"menuitem13",
					onclick : {
						fn :onMenuItemClick,
						obj :"menuitem13"
					}
				}, {
					text :"menuitem_" + "xx_" + (count++),
					onclick : {
						fn :onMenuItemClick,
						obj :"menuitem_" + "xx_" + i 
					}
				} ];
				arrMenu["xx_" + i] = myContextMenu;
			}
		}
		initMenuItem();
	
		function onMenuItemClick(p_sType, p_aArgs, p_oValue) {
			//YAHOO.log(p_oValue, "info");
		}
	
		function generateContextMenu(id, trigger, itemdata) {
			var oConfig = {
				trigger :trigger,
				itemdata :itemdata,
				zIndex :10000,
				lazyload :true,
				effect : {
					effect :YAHOO.widget.ContainerEffect.FADE,
					duration :0.1
				}
			};
			function onContextMenuRender(p_sType, p_aArgs) {
				oContextMenu.clearContent();
				oContextMenu.itemData = arrMenu[oContextMenu.contextEventTarget.id];
				oContextMenu.addItems(arrMenu[oContextMenu.contextEventTarget.id]);
				oContextMenu.showEvent.subscribe(function() {
					document.getElementById(oContextMenu.contextEventTarget.id).focus();
				});
				oContextMenu.render(oContextMenu.contextEventTarget.id);
			}// onContextMenuRender
			var oContextMenu = new YAHOO.widget.ContextMenu(id, oConfig);
			oContextMenu.showEvent.subscribe(onContextMenuRender);
			oContextMenu.render(trigger);
	
			arrOMenu.push(oConfig);
			arrOMenu.push(oContextMenu);
		} // generateContextMenu
	
		function init() {
			var myContextMenu = [ {
			}];
	
			clear();
			
			initMenuItem();
			
			for ( var i = 0; i < 100; i++) {
				var id = "xx_" + i;
				var ele = document.createElement("div");
				ele.id = id;
				ele.innerHTML = id;
				document.body.appendChild(ele);
				generateContextMenu("xx_menu_" + i, ele.id, myContextMenu);
			}
		}
	
		function clear() {
			for ( var i = 0; i < arrOMenu.length; i++) {
				try {
					arrOMenu[i].destroy();
					arrOMenu[i] = null;
				} catch(e) {}
			}
			for ( var i = 0; i < 100; i++) {
				var id = "xx_" + i;
				var node = document.getElementById("xx_menu_" + i);
				if (node != null) {
					var parent = node.parentNode;
					parent.removeChild(node);
					node = null;
					parent = null;
				}
				
				var node = document.getElementById(id);
				if (node != null) {
					var parent = node.parentNode;
					parent.removeChild(node);
					node = null;
					parent = null;
				}
			}
		}
	</script>
</head>
<body class="yui-skin-sam">
<input type="button" value="refresh" onclick="init()" />
<div id="myLogger"></div> 
<div id="myMenu"></div> 
</body>
</html>
<script language="JavaScript">
	//init();
	//window.setTimeout("window.location.reload()", 5000, "javascript");
</script>